<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <title>title</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <style>
            body {
              margin-top: 1.5rem;
              /*background: red*/
            }
            .page {
                background: white;
                width: 100%;
                height: 100%;
                flex-wrap: wrap;
                box-sizing: border-box;
            }
            .header {
                width: 93%;
                height: 2.5rem;
                line-height: 2.5rem;
                padding: 0.5rem 0.8rem;
                text-align: center;
                background-color: #fff;
                border-bottom: 1px solid rgb(243,243,243,0.5)
            }
            .header_img{
              width: 6%;
              height: 45%;
              float: left;
              margin-top: 0.5rem;
            }
            .header_img img {
                width: 100%;
                height: 100%;
            }
            .header p {
              line-height: 3rem;
              width:30%;
              margin-left: 5.3rem;
              text-align: center;
              float: left;
            }
            .title {
                font-size: 1.1rem;
            }
            .middle {
                width: 60%;
                height: 12rem;
                text-align: center;
                position: absolute;
                left: 20%;
                top: 26%;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                /*display: none;*/
                box-sizing: border-box;
            }
            .middle p {
                color: #999999;
                font-size: 0.8rem;
            }
            .middle img {
                width: 8rem;
                height: 8rem;
                margin-bottom: 1.5rem;
            }
            .bottom {
                position: absolute;
                bottom: 2rem;
                left: 40%;
                font-size: 0.9rem;
                font-weight: 600;
                box-sizing: border-box;
            }
          .middle_now{
            width: 93%;
            height: 5rem;
            padding: 0.6rem 0.8rem;
            border-bottom: 1px solid rgb(243,243,243,0.5);
          }
          .fl{
            float: left;
          }
          .fr{
            float: right;
          }
          .now_bo{
            height: 3rem;
            line-height: 3rem;
          }
          .flp{
            width: 10%;
            height: 1.5rem;
            line-height: 1.5rem;
            font-size: 0.9rem;
            text-align: center;
            margin-top: 0.8rem;
            background-color: black;
            color: #fff;
          }
          .flpp{
            width:4.5rem;
            height: 2rem;
            margin-top: 1rem;
            line-height:1.2em;
            margin-left: 0.5rem;
              font-size: 0.9rem;
          }
          .flppp{
            width: 65%;
            height: 2rem;
            margin-top: 1rem;
            line-height:1.2em;
            font-size: 0.9rem;
          }
    </style>
</head>

<body>
    <div class="page">
        <div class="header">
            <div class="header_img">
                <img src="../image/u18.png" alt="" onclick="closewin()">
            </div>
            <p>收货地址</p>
            <p style="margin-left:0.5rem;text-align:right;padding-right:0.5rem" onclick="add()">新增</p>
        </div>
        <!--没地址-->
        <!-- <div class="middle" id="middle">
            <img src="../image/aa1.png">
            <p>深夜那一抹灯光的温暖，是家的方向</p>
            <p>留下家的方向，让优品置于家中</p>
        </div> -->
        <div id="addlist">

        </div>
        <ul id="address" style="display:none">
        </ul>
        <!-- <div class="bottom" onclick="add()">新建收货地址</div> -->
    </div>
</body>
<script type="text/javascript" src="../script/jquery-1.8.3.js"></script>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript">
var userinfo = $api.getStorage('userinfo');
var add_id =''
var id
    apiready = function() {
      id = api.pageParam.id
      getlist()

    };
    function add(){
      api.openWin({
          name: 'address_add',
          url: './address_add.html',

      });
    }

    function qr() {
      if(add_id==''){
        msgcode('请选择地址')
        return false;
      }
      api.ajax({
          url: SITE_URL+'product_api/product/by_pro',
          method: 'post',
          data: {
              values: {
                  user_id: userinfo.id,
                  pro_id:id,
                  add_id:add_id
              }
          }
      },function(ret, err){
          if (ret) {
            if(ret.error==200){
              msgcode('购买成功')
              setTimeout(function () {
                api.closeWin({

                });

              },500)
            }else if(ret.error==250){
              msgcode('就在刚刚已经被另一个人抢走了')
            }else{
              msgcode('稍后再试')
            }
              //alert( JSON.stringify( ret ) );
          } else {
            msgcode('请检查网络连接')
              //alert( JSON.stringify( err ) );
          }
      });

    }

    function qradd(self,keys) {
      $(".middle_now").css('background-color','white')
      $(self).css('background-color','#DEDEDE')
      add_id=keys
    }

    function getlist() {
      var html =''
      var obj = $api.byId('addlist');

      api.ajax({
          url: SITE_URL+'product_api/address/get_address',
          method: 'post',
          data: {
              values: {
                  user_id: userinfo.id
              }
          }
      },function(ret, err){
          if (ret) {
            if(ret.error==200){//有地址
              for (var i = 0; i < ret.data.length; i++) {
                var dat = ret.data[i]
                html+='<div class="middle_now" onclick="qradd(this,'+dat.id+')">'
                  html+='<div class="now_top" style="width:100%;height:2rem;line-height:2rem;">'
                    html+='<p class="fl">收货人：'+dat.name+'</p>'
                    html+='<p class="fr">'+dat.phone+'</p>'
                  html+='</div>'
                  html+='<div class="now_bo" style="width:100%;">'
                  if(dat.status==1){
                    html+='<p class="fl flp">默认</p>'
                  }else{
                    html+='<p class="fl flp">正常</p>'
                  }

                    html+='<p class="fl flpp">收货地址：</p>'
                    html+='<p class="fl flppp">'+dat.province+'&nbsp;'+dat.street+'</p>'
                  html+='</div>'
                html+='</div>'
              }
              $api.html(obj, html);

            }else{//无地址
              msgcode('快去添加地址吧')
            }
              //alert( JSON.stringify( ret ) );
          } else {
            msgcode('请检查网络连接')
              //alert( JSON.stringify( err ) );
          }
      });
    }
</script>

</html>
